<template>
  <el-dialog
    class="eldialog el-dialog-m0"
    :visible.sync="visible"
    :title="title"
    :close-on-click-modal="false"
    append-to-body
    top="2vh"
    width="90%"
    :close-on-press-escape="false"
    element-loading-text="数据加载中"
    v-loading="loading"
  >
    <el-form :inline="true" :model="msgData" :rules="rules" ref="msgData" class="demo-form-inline">
      <el-row>
        <el-col :span="24" align="center">
          <el-form-item prop="dw">
            <el-input :disabled="flag" maxlength="30" size="small" placeholder="请输入单位名称" v-model="msgData.dw"></el-input>
          </el-form-item>
          <span style="font-size: 28px;line-height: 32px;font-weight: 900;height: 50px;">2022年度年轻干部年度推进情况统计表</span>
          <el-button style="margin-right: 30px;margin-top: 10px;float: right" type="primary" plain @click="downZip"
          >&nbsp;导出<i class="el-icon-upload el-icon--right"></i>
          </el-button>

          <el-button v-if="btType === '2'" style="margin-right: 10px;margin-top: 10px;float: right" type="primary"
                     icon="el-icon-edit" plain
                     @click="auditTable()" :disabled="shztMid === '1' || shztGHB === '1'">&nbsp;审核
          </el-button>
          <el-button v-if="btType === '2' && (shztMid === '1'||shztGHB === '1')"
                     style="margin-right: 10px;margin-top: 10px;float: right" type="primary" icon="el-icon-edit" plain
                     @click="flag = false;shztMid = '0';shztGHB = '0'">&nbsp;修改
          </el-button>
          <el-button v-if="role == '系统管理员'" style="margin-right: 10px;margin-top: 10px;float: right" type="primary"
                     icon="el-icon-edit" plain
                     @click="save('msgData')">&nbsp;保存
          </el-button>
          <el-button v-else style="margin-right: 10px;margin-top: 10px;float: right" type="primary" icon="el-icon-edit"
                     plain
                     @click="save('msgData')" :disabled="flag">&nbsp;保存
          </el-button>
        </el-col>
      </el-row>
      <el-row>
        <el-form-item label="填表人：" prop="tbr">
          <el-input :disabled="flag" maxlength="15" size="small" placeholder="请输入填表人姓名"
                    v-model="msgData.tbr">
          </el-input>
        </el-form-item>
        <el-form-item label="联系方式：" prop="lxfs">
          <el-input :disabled="flag" size="small" placeholder="请输入联系方式"
                    oninput="if(value.length>15)value=value.slice(0,15)"
                    v-model="msgData.lxfs">
          </el-input>
        </el-form-item>
      </el-row>
    </el-form>
    <el-row>
      <vxe-table style="width: 100%"
                border
                :data="tjqktjData">
        <vxe-column
          title="人员构成"
          align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.rygc == '1'">全部人员</span>
            <span v-if="scope.row.rygc != '1'">机关+参公</span>
          </template>
        </vxe-column>
        <vxe-colgroup 
          title="中层正职（正处级领导职务）"
          align="center">
          <vxe-column
            title="批复职数"
            align="center">
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zczzPfzs">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            title="实配数"
            align="center">
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zczzSps">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            align="center">
            <template slot="header">      
                <div>2021年底</div>
                <div>配备41岁</div>
                <div>以下干部数</div>
              </template>
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zczzPb41nsl">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            align="center">
            <template slot="header">      
                <div>2022年内</div>
                <div>计划补充41岁</div>
                <div>以下干部数</div>
              </template>
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zczzBc41nsl">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            align="center">
            <template slot="header">      
                <div>2022年底</div>
                <div>41岁以下</div>
                <div>干部计划达到</div>
              </template>
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zczzDd41nsl">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            width="120"
            align="center">
            <template slot="header">      
                <div>目前配备</div>
                <div>41岁以下</div>
                <div>干部数</div>
              </template>
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zczzMq41nsl">
              </el-input>
            </template>
          </vxe-column>
        </vxe-colgroup>
        <vxe-colgroup 
          title="中层副职（副处级领导职务）"
          align="center">
          <vxe-column
            title="批复职数"
            align="center">
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zcfzPfzs">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            title="实配数"
            align="center">
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zcfzSps">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            align="center">
            <template slot="header">      
                <div>2021年底</div>
                <div>配备36岁</div>
                <div>以下干部数</div>
              </template>
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zcfzPb36nsl">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            align="center">
            <template slot="header">      
                <div>2022年内</div>
                <div>计划补充36岁</div>
                <div>以下干部数</div>
              </template>
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zcfzBc36nsl">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            align="center">
            <template slot="header">      
                <div>2022年底</div>
                <div>36岁以下</div>
                <div>干部计划达到</div>
              </template>
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zcfzDd36nsl">
              </el-input>
            </template>
          </vxe-column>
          <vxe-column
            width="120"
            align="center">
            <template slot="header">      
                <div>目前配备</div>
                <div>36岁以下</div>
                <div>干部数</div>
              </template>
            <template slot-scope="scope">
              <el-input :disabled="flag" oninput="value = value.replace(/[^\d.]/g,'')"
                        v-model="scope.row.zcfzMq36nsl">
              </el-input>
            </template>
          </vxe-column>
        </vxe-colgroup>
      </vxe-table>
    </el-row>

  </el-dialog>
</template>

<script>

  /*方法引用*/
  import {getList, save,downLsqk,auditTable} from '@/api/young/evaluation/infoFilling/infoFilling.js'

  export default {
    name: "tjqktjTable-sz",
    components: {},
    data() {
      return {
        dataForm: null,
        title: '推进情况统计表',
        visible: false,
        pdfUrl: '',
        heightY: window.innerHeight - 90 + 'px',
        heightZ: window.innerHeight - 360 + 'px',
        widthY: window.innerWidth / 2 - 50 + 'px',

        loading: false,
        flag:false,
        btType:'',
        role:'',
        shztMid:'',
        shztGHB:'',
        taskId: '',
        tjqktjData: [],
        msgData: {
          "id": "",
          "dw": "",
          "tbr": "",
          "lxfs": "",
          "taskId": "",
          "sjd": "mid"
        },
        rules: {
          tbr: [
            {required: true, message: '请输入填表人姓名', trigger: 'blur'}
          ],
          lxfs: [
            {required: true, message: '请输入联系方式', trigger: 'blur'}
          ],
          dw: [
            {required: true, message: '请输入单位名称', trigger: 'blur'}
          ],
        },
        reg : /^([1-9][0-9]*|0)(\.[0-9]*[1-9])?$/
      }
    },
    methods: {
      async initShow(task,role,shztGHB,type) {
        this.task =task;
        this.btType = type;
        this.taskId = task.id;
        this.role = role;
        this.shztGHB = shztGHB;
        this.visible = true;
        this.msgData = {};
        this.tjqktjData = [];
        const params = {
          'taskId': task.id,
          'type': '4'
        };
        this.loading = true;
        getList(params).then((data) => {
          console.log(data.resultdata)
          if (data.type) {
            if (data.resultdata.bt) {
              this.msgData = data.resultdata.bt
              this.shztMid = data.resultdata.bt.shztMid
            }
            if (data.resultdata.list) {
              this.tjqktjData = data.resultdata.list
            }
            this.loading = false;
          } else {
            this.$message.error(data.message)
          }
          if (this.shztGHB == '1' || this.shztMid == '1'){
            this.flag = true;
          }else {
            var jgid= JSON.parse(sessionStorage.getItem(`userInfo`)).organizeId
            if (jgid !== task.dwBianma) {
              if (role == '系统管理员'||role.indexOf('干部一处')>-1||role.indexOf('干部二处')>-1||
                role.indexOf('干部三处')>-1||role.indexOf('干部四处')>-1||role.indexOf('干部五处')>-1) {
                this.flag = true;
              }else { 
                this.flag = false;
              }
            }else {
              this.flag = false;
            }
          }
        })
      },

      //保存
      save(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.$confirm('是否保存?', '操作提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              this.msgData.taskId = this.taskId;
              this.msgData.sjd = 'mid'
              this.tjqktjData.forEach((item) => {
                item.taskId = this.taskId;
              });
              const params = {
                'bt': this.msgData,
                'data': this.tjqktjData,
                'type': '4'
              };
              console.log(params)
              this.loading = true;
              save(params).then((data) => {
                console.log(data.result)
                if (data.result) {
                  this.loading = false;
                  this.$message.success('保存成功!')
                  this.visible = false;
                } else {
                  this.loading = false;
                  this.$message.error(data.message)
                }
              })
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '已取消保存'
              });
            });
          }
        });
      },

      //审核
      auditTable(){
        this.$confirm('是否审核通过?', '操作提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.msgData.taskId = this.taskId;
          this.msgData.sjd = 'begin'
           const params = {
            'id': this.msgData.id,
            'task': this.task,
            'type': '4'
          };
          this.loading = true;
          auditTable(params).then((data) => {
            if (data.result) {
              this.loading = false;
              this.$message.success('审核通过!')
              this.visible = false;
            } else {
              this.loading = false;
              this.$message.error(data.message)
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消审核!'
          });
        });
      },
        //下载
        downZip(){
            const month= new Date().getMonth() + 1;
            const params = {
                taskId: this.taskId,
                type : 4,
                fileName:this.msgData.dw+"年中统计(" +
                    new Date().getFullYear() +"年"+month+ "月).zip"
            }
            this.$confirm('是否下载?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.pageLoading = true;
                downLsqk(params).then(result => {
                    this.pageLoading = false;
                    // this.$alert('成功')
                })
            })
        },
    }
  }
</script>

<style scoped>
   >>>.el-input.is-disabled .el-input__inner{
    color: #606266;
  }
  /*调整表格文字*/
  >>>.vxe-header--column .vxe-cell--title{
    font-size: 14px;
    font-weight: normal;
    color:#000;
  }
  >>>.vxe-header--row{
    background:#fff;
  }
</style>
